import { Component, OnInit, Input, NgZone } from '@angular/core';

import { MessageService } from 'src/app/shared/service/message.service';

import { Subscription } from 'rxjs';

import { EventService } from 'src/app/shared/service/event.service';

import { AppGlobalService } from '../../shared/service/app-global.service';
import { HttpService } from '../../shared/service/http.service';
@Component({
  selector: 'app-merchant-list',
  templateUrl: './merchant-list.component.html',
  styleUrls: ['./merchant-list.component.scss'],
})
export class MerchantListComponent implements OnInit {
  //   {
  //     "type":"tag",
  //     "style":"app-merchantList-tag",
  //     "name":null,
  //     "linearLayout":"body",
  //     "data":{
  //         "data":[
  //             {
  //                 "top":{
  //                     "authTag":{
  //                         "label":"认证",
  //                         "ifauth":true
  //                     },
  //                     "leftImage":{
  //                         "image":"1.png"
  //                     }
  //                 },
  //                 "thirdRowLeft":{
  //                     "moneyLabel":{
  //                         "cssStyle":"color:#858894;font-size:1rem",
  //                         "label":"10-50万"
  //                     }
  //                 },
  //                 "fourthRowRight":{
  //                     "shopNumber":{
  //                         "label":"门店32家"
  //                     },
  //                     "applyNumber":{
  //                         "label":"208人申请"
  //                     }
  //                 },
  //                 "link":{
  //                     "type":"page",
  //                     "params":{
  //                         "opportunity_id":"opportunity_id"
  //                     },
  //                     "target":"59168"
  //                 },
  //                 "thirdRowRight":{
  //                     "industryLabel":{
  //                         "label":"火锅店"
  //                     }
  //                 },
  //                 "title":"李家有米煲仔饭",
  //                 "secondRowLeft":{
  //                     "text":"李家有米用顺德美食烹饪标准将传统手......"
  //                 }
  //             },
  //             {
  //                 "top":{
  //                     "authTag":{
  //                         "label":"认证",
  //                         "ifauth":true
  //                     },
  //                     "leftImage":{
  //                         "image":"1.png"
  //                     }
  //                 },
  //                 "thirdRowLeft":{
  //                     "moneyLabel":{
  //                         "cssStyle":"color:#858894;font-size:1rem",
  //                         "label":"10-50万"
  //                     }
  //                 },
  //                 "fourthRowRight":{
  //                     "shopNumber":{
  //                         "label":"门店32家"
  //                     },
  //                     "applyNumber":{
  //                         "label":"208人申请"
  //                     }
  //                 },
  //                 "link":{
  //                     "type":"page",
  //                     "params":{
  //                         "opportunity_id":"opportunity_id"
  //                     },
  //                     "target":"59168"
  //                 },
  //                 "thirdRowRight":{
  //                     "industryLabel":{
  //                         "label":"火锅店"
  //                     }
  //                 },
  //                 "title":"李家有米煲仔饭",
  //                 "secondRowLeft":{
  //                     "text":"李家有米用顺德美食烹饪标准将传统手......"
  //                 }
  //             }
  //         ],
  //         "submit":{
  //             "content":{
  //                 "code":"4403",
  //                 "pageNo":1
  //             },
  //             "id":"c180c4c4-5177-472f-9008-70627357a3e4"
  //         }
  //     },
  //     "pageSize":2,
  //     "pageNo":1,
  //     "pageTotal":453
  // }

  @Input() tagData: any;
  pageTotal: 0;
  pageSize: 0;
  pageNo: any = 1;
  params: any;
  defaultImgUrl = "../../assets/img/375x250@2x.png";
  keyword: any;
  // 声明订阅对象
  subscription: Subscription = null;
  constructor(
    private appGlobalService: AppGlobalService,
    private message: MessageService,
    private http: HttpService,
    private ngZone: NgZone,
    private eventService: EventService
  ) {
  }

  ngOnInit() {
    console.log('msg-----> ngOnInit merchant-list ' + new Date().toLocaleTimeString());
    this.params = this.tagData.data.submit;
    this.pageNo = this.tagData.pageNo;
    this.pageSize = this.tagData.pageSize;
    this.pageTotal = this.tagData.pageTotal;
    const len = this.tagData.data.data.length;
    if (this.tagData.data.submit && this.tagData.data.data.length === 0 && this.tagData.searchText) {
      this.keyword = Object.values(JSON.parse(this.tagData.searchText) )[0];
  }
    if (len > 0) {
      let initAds;
      let index = 0;
      let secondRow;
      // 取第3个位置的图片交换
      for (let i = 0; i < len; i++) {
        const v = this.tagData.data.data[i];
        if (!v.advertising && !v.top) {
          continue;
        }
        if (v.images && v.images.imageUrl !== undefined && (v.images.imageUrl + '').startsWith('http')) {
          let url = v.images.imageUrl ;
          url = url.replace(';', '');
          v.images.imageUrl = url;
        }
        this.tagData.data.data[i] = v;
        if (i === 2) {
          if (!v.advertising) {
            secondRow = v;
          }
        }
        if (v.advertising) {
          initAds = v;
          index = i;
        }
      }

      if (initAds) {
        for (let i = 0; i < len; i++) {
          const v = this.tagData.data.data[i];
          if (!v.advertising && !v.top) {
            continue;
          }
          if (i === 2 && !v.advertising) {
            this.tagData.data.data[i] = initAds;
            this.tagData.data.data[index] = secondRow;
          }
        }
      }

    }
    const that = this;
    // 有list 头部 有filter tag时才 配置 list tag Name: 'app-merchantList-tag-filter'
    // 纯 list 时 this.tagData.name 为： 'app-merchantList-tag'
    if (!this.subscription && this.tagData.name && this.tagData.name === 'app-merchantList-tag-filter') {
      // event.target.disabled = true;
      // 获取筛选参数
      this.subscription = this.message.getMessage().subscribe(param => {
        console.log('msg-----> getMessage() ==========' + new Date().toLocaleTimeString());
        // this.message.clearMessage();
        // // 重置当前页数
        this.pageNo = 1;
        // 参数
        if (!param) {
          return;
        }
        if (!localStorage.getItem('siftReqConditionTag')) {
          return;
        }
        const siftReqCondition = JSON.parse(localStorage.getItem('siftReqConditionTag'));
        that.postByParam(siftReqCondition);
        // localStorage.removeItem('siftReqConditionTag');
        // this.message.clearMessage();
      });
    }
  }

  // 发送请求更新UI
  postByParam(param) {
    this.params.content = param;
    // // 页面数据参数
    this.params.content.pageNo = this.pageNo;
    this.params.sessionId = localStorage.getItem('sessionId');
    // setTimeout(() => {
    //   this.ngZone.runOutsideAngular(() => {
    //     this.ngZone.run(() => {
    // 请求获取新数据
    this.http.post('application/submit', this.params, res => {
      // 请求数据成功
      if (res.success) {
        const result = res.data.data; // JSON.parse(res.data.data);
        // 筛选数据
        this.ngZone.run(() => {
          this.tagData.data.data = result;
        });
        // this.tagData.data.data = null;
        // this.tagData.data.data = result;
        // that.updateDataSource(result);
        // this["tagData"]["data"]["data"] = result;
        // tslint:disable-next-line:no-string-literal
        // that.tagData["data"]["data"] = result;
        // this.tagData.data.data = result;

        // that.tagData.data.data = [];
        // this.tagData.data.data.forEach(element => {
        //     if (this.clickedOpp && this.clickedOpp.indexOf(element.link.params.opportunity_id) > -1) {
        //         element.clicked = true;
        //     }
        // });
      } else {
        // 请求数据失败
        this.tagData.data.data = [];
        this.appGlobalService.showToast(res.message, 2000, 'middle');
      }
    },
      err => {
        // 请求数据失败
        this.tagData.data.data = [];
        this.appGlobalService.showToast(err.message, 2000, 'middle');
      });
    //     });
    //   });
    // }, 500);

  }

  updateDataSource(objArray) {
    // this.tagData = null;
    this.ngZone.runOutsideAngular(() => {
      this.ngZone.run(() => {
        this.tagData.data.data = objArray;
      });
    });
  }

  // tslint:disable-next-line:use-life-cycle-interface
  ngOnDestroy(): void {
    try {
      if (this.tagData.data.submit !== undefined) {
        // 组件生命周期结束的时候，注销
        this.subscription.unsubscribe();
      }
    } catch (error) {
    }
  }


  get(obj) {
    if (obj.type === "url") {
      this.appGlobalService.openUrl(null, obj.target);
    } else {
      const params = {
        pageId: obj.target,
        params: obj.params,
        sessionId: localStorage.getItem('sessionId')
      };
      this.appGlobalService.goToForward(params);
    }
  }


  loadMoreData(event) {
    setTimeout(() => {
      this.params.sessionId = localStorage.getItem('sessionId');
      // 请求下一个页面
      this.pageNo = this.pageNo + 1;
      this.params.content.pageNo = this.pageNo;
      // 请求获取新数据
      this.http.post('application/submit', this.params, res => {
        // 请求数据成功
        if (res.success) {
          // 追加返回数据
          if (Array.isArray(res.data.data) && res.data.data.length > 0) {
            // 追加数据
            res.data.data.map(item => {
              this.tagData.data.data.push(item);
            });
            // this.params = res.data.submit;
          } else {
            // 没有数据了
            // this.appGlobalService.showToast('没有数据了...', 1000, 'bottom');
          }
          event.target.complete();
        } else {
          // 请求失败，更新当前页数
          this.pageNo = this.pageNo - 1;
          // 请求数据失败
          this.appGlobalService.showToast(res.message, 2000, 'middle');
          event.target.complete();
        }
      });
    }, 500);
  }

  getNgStyle(str) {
    try {
      return JSON.parse(str);
    } catch (error) {
      return {};
    }
  }

  moreActionClick(obj) {
    this.eventService.eventEmit.emit('searchTabListener', obj);
  }
}
